
<div class="container">
	
	<div class="demo-row">
		<div class="demo-title"> Todo List</div>
		<div class="demo-content">
			<div class="alert alert-danger" ng-show="error">{{errorMessage}}</div>
				<div class="row">
					<form ng-submit="addTodo(todoName)">
						<div class="col-lg-8">
							<input class="form-control" placeholder="Enter Name" ng-model="todoName" required min="1"> 
						</div>
					</form>
					<button class="btn btn-primary" 
						ng-disabled="!todoName" 
						ng-hide="editMode" 
						ng-click="addTodo(todoName)">Add Todo User</button>
					<button class="btn btn-primary"
							ng-disabled="!todoName"
							ng-show="editMode"
							ng-click="updateTodo(todoName)">Save</button>
					<button class="btn btn-primary"
							ng-click="resetTodoField()">Reset</button>	
				</div>
				
				<hr>
				<div class="row">
					<div class="col-lg-8">
						<div class="form-group">
							<div class="input-group">
								<input type="text" class="form-control" placeholder="Search" ng-model="searchTodo" 
								typeahead="todo for todo in todoUsers | filter:$viewValue | limitTo: 8">
								<span class="input-group-btn">
									<button type="submit" class="btn"><span class="fui-search"></span></button>
								</span>
							</div>
						</div>
					</div>
				</div>
				
				<hr>
				
				<div class="alert alert-info" ng-show="todoUsers.length == 0">
					No User found
				</div>
				
				<table class="table table-hover table-bordered table-striped" ng-show="todoUsers.length > 0">
					<thead>
						<tr>
							<th>Id</th>
							<th>Name</th>
							<th>Update</th>
							<th>Delete</th>
						</tr>
					</thead>
					<tbody>
						<tr ng-repeat="todo in todoUsers | filter:searchTodo">
							<td>{{todo.id}}</td>
							<td>{{todo.name}}</td>
							<td><button class="btn btn-success" ng-click="editTodo(todo.id)">Update</button></td>
							<td><button class="btn btn-danger" ng-click="deleteTodo(todo.id)">Delete</button></td>
						</tr>
					</tbody>
				</table>
				<button class="btn btn-danger" ng-click="deleteAllTodo()">Delete All User</button>
		
		</div><!-- Demo Content -->
	</div><!-- Demo Row -->
	
</div> <!-- End Container -->